<template>
	<div class="shenfen_wrapper">
		<idenheader leftTitle="身份认证" rightData="数据来自中国公安部"></idenheader>
		<div v-show="shenfen.info.msg ==='一致'" class="shenfen_pass">身份证查询为本人</div>
		<div v-show="!shenfen.info.msg ==='一致'" class="shenfen_nopass">未查询到身份记录</div>
		<div class="shenfen_info">
			<ul class="m-list">
                <li>
                    <label>姓&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名</label>
                    <span class="ng-binding">{{shenfen.name.name}}</span>
                </li>
				<li>
					<label>身份证号码</label>
					<span class="ng-binding">{{shenfen.name.idCard}}</span>
				</li>

                <li>
                    <label>出&nbsp;生&nbsp;日&nbsp;期</label>
                    <span class="ng-binding">{{shenfen.info.bornDate}}</span>
                </li>
                <li>
                    <label>户口发证地</label>
                    <span class="ng-binding">{{shenfen.info.bornLocation}}</span>
                </li>
            </ul>
		</div>
	</div>
	
</template>

<script>
	import idenheader from '../common/idenheader';
	export default {
		components:{
			idenheader
		},
		props:['shenfen']
	}
</script>

<style scoped>
	.shenfen_wrapper{
		border: 1px solid #EDEDED;
		border-radius: 2px 2px 3px 3px;
	}
	.shenfen_pass{
		padding: 0 17px;
		height: 36px;
		line-height: 36px;
	    color: #ff4949;
	    color: rgb(84,195,0);
	    border-bottom: 1px solid #EDEDED;
	}
	.shenfen_nopass{
		padding: 0 17px;
		height: 36px;
		line-height: 36px;
        color: #ff4949;
        border-bottom: 1px solid #EDEDED;
	}
	.shenfen_info{
		padding: 0 17px;
	}
	.shenfen_photo{
		margin: 10px 0 20px 0;
		width: 42px;
		height: 42px;
	}
	.m-list{
		padding-top: 10px;
	}
	.m-list li{
		list-style: none;
		margin-bottom:10px;
		font-size: 1.2rem;
	}
	.m-list li label{
		text-align: justify;
    	color: #9b9b9b;
    }
    .m-list li span{
	    color: #212121;
	    margin-left: 16px;
    }
</style>